<template>
	<view>
		<headerView ref="headerView"></headerView>
		<adView></adView>
		<view class="mainContent">
			<view class="sendCp">
				<text class="fabu_btn" @click="addtz()">发布新帖</text>
				<text style="margin-left: 20px;">请务必发布真实可靠的帖子信息</text>
			</view>

			<view class="top_title">
				<a @click="showAll()" :class="[{'caidan_a_check':candanIndex == 0},{'caidan_a':candanIndex !=0}]">全部</a>
				<a @click="showCp(1,1)"
					:class="[{'caidan_a_check':candanIndex == 1},{'caidan_a':candanIndex !=1}]">产品</a>
				<a @click="showQd(1,2)"
					:class="[{'caidan_a_check':candanIndex == 2},{'caidan_a':candanIndex !=2}]">渠道</a>
			</view>
			<view class="titleLable">
				<view class="title">标题 今天帖子数<text
						style="color: #FB9E00; font-size: 18px;">({{this.todysTieziSize}})</text></view>
				<view class="rightTitle">
					<view class="ck">查看/回复</view>
					<view class="zuozhe">作者</view>
					<view class="time">更新时间</view>
				</view>
			</view>
			<view class="main_content">

				<view class="content_body" v-for="item in datas" @click="showDetail(item)">
					<view class="content_title">
						<view class="content_title_lable" v-if="isCp(item)"> 产品</view>
						<view class="content_title_lable" v-else>渠道</view>
						<view>
							<img src="../../../static/userimage.png" style="width: 35px;height: 35px;margin-left: 15px;
						margin-right: 15px; border-radius: 100%;"></img>
						</view>
						<view style="display: flex;flex-direction: column;">
							<view class="content_title_content">标题:&nbsp{{item.LUNTAN_BIAOTI}}</view>
							<view class="content_title_content">作者:&nbsp{{item.userName}}</view>
						</view>


					</view>
					<view class="rightTitle">
						<view class="ck">{{item.LUNTAN_CKSL}}/{{item.LUNTAN_PLSL}}</view>
						<view class="zuozhe">{{item.userName}}</view>
						<view class="time">{{getTime(item.updateTime)}}</view>
					</view>
				</view>
			</view>
		</view>
		<pageView></pageView>
		<footerView></footerView>
	</view>
</template>

<script>
	import headerView from '../header/Headerview.vue'
	import footerView from '../footer/Footer.vue'
	import adView from '../ads/MyAdView.vue'
	import pageView from '../../views/PageView.vue'
	export default {
		components: {
			headerView,
			adView,
			footerView,
			pageView
		},
		created() {
			//注册全局监听事件，搜索后更新界面数据
			uni.$on('showSearchData', (res) => {
					this.search(res);
				}),
				uni.$on('pageClick', (page) => {

					this.getLuntan(page);
				})
		},
		data() {
			return {
				datas: [],
				candanIndex: 0,
				tjs: [],
				tiezi_type: null,
				todysTieziSize: 0,

			}
		},
		props: {
			msg: String
		},
		mounted() {
			
			this.$nextTick(() => {
				this.getLuntan(1);
			});

		},
		onReady() {
			this.$refs.headerView.setIndex(3);
		},
		methods: {
			addtz(){
				uni.navigateTo({
					url: './addTiezi'
					
				})
			},
			//跳转到详情页面
			showDetail(lt) {
				//this.addck(cp.CHANPIN_ID);
				uni.navigateTo({
					url: './luntanDetail',
					//url: './ltdetail',
					success: function(res) {
						res.eventChannel.emit('showLt', lt)

					}
				})
			},
			showAll() {
				this.tiezi_type = null;
				this.getLuntan(1);
				this.candanIndex = 0;
			},
			showCp() {
				this.tiezi_type = 1;
				this.getLuntan(1);
				this.candanIndex = 1;
			},
			showQd() {
				this.tiezi_type = 2;
				this.getLuntan(1);
				this.candanIndex = 2;
			},
			async getLuntan(pageNum) {
				try {
					const res = await this.$getData({
						url: this.$apis.getLunTans,
						data: {
							page: pageNum,
							tiezi_type: this.tiezi_type,
						}
					})
					this.datas = res.data.data;
					if (res != null) {
						this.todysTieziSize = res.data.todysTieziSize;
					}
					if (res.data.tj != null) {
						this.tjs = res.data.tj;
					}

				} catch (e) {
					console.log("eee: ", e);
				}
			},
			getTime(data) {
				return this.$Utils.getTimer(data);
			},
			isCp(data) {
				if (data.tiezi_type == 1) {
					return true;
				} else {
					return false;
				}
			},

		},
	}
</script>

<style>
	.mainContent {
		align-items: center;
		flex-direction: column;
		min-height: 900px;
		display: flex;
	}

	.main_content {
		border: 1px solid #E5E5E5;
	}

	.content_body {
		justify-content: center;
		height: 85px;
		border-bottom: 1px solid #E5E5E5;
		align-items: center;
		display: flex;
	}

	.top_title {
		align-items: center;
		width: 1200px;
		height: 45px;
		margin-left: 10px;
		font-size: 1.625rem;
		font-weight: bold;
		display: flex;
	}

	.content_title {
		align-items: center;
		width: 600px;
		height: 95px;
		margin-left: 10px;
		font-size: 0.925rem;
		display: flex;

	}

	.caidan_a {
		margin-left: 1.525rem;
		margin-right: 1.525rem;
		font-size: 1.125rem;
		color: #000;

	}

	.caidan_a_check {
		margin-left: 1.525rem;
		margin-right: 1.525rem;
		font-size: 1.225rem;
		font-weight: bold;
		color: #F99B15;

	}

	.titleLable {
		display: flex;
		flex-direction: row;
		width: 1200px;
		background: #E5E5E5;
		height: 45px;
		align-items: center;
		justify-content: space-between;
	}

	.rightTitle {
		display: flex;
		flex-direction: row;
	}

	.title {
		white-space: nowrap;
		display: flex;
		overflow: hidden;
		padding-left: 20px;
		width: 650px;

	}

	.ck {
		width: 150px;
		white-space: nowrap;
		display: flex;
		overflow: hidden;
	}

	.zuozhe {
		white-space: nowrap;
		display: flex;
		overflow: hidden;
		width: 150px;

	}

	.time {
		white-space: nowrap;
		display: flex;
		overflow: hidden;
		padding-right: 50px;
		justify-content: flex-end;
		display: flex;
		text-align: right;
		width: 100px;

	}

	.content_body {
		display: flex;
		flex-direction: row;
		width: 1200px;
		height: 75px;
		align-items: center;
		border-radius: 3px;
		justify-content: space-between;
	}

	.content_title_lable {
		padding-left: 10px;
		padding-right: 10px;
		background: #E5E5E5;
		border-radius: 10px;
	}

	.sendCp {
		width: 1200px;
		display: flex;
		align-items: center;
	}

	.fabu_btn {
		background: #FB9E00;
		color: #FFFFFF;
		height: 35px;
		padding-left: 5px;
		padding-right: 5px;
		border-radius: 3px;
		text-align: center;
		align-items: center;
		display: flex;
	}
	
	.fabu_btn :hover{
		 cursor:pointer;
		 background: #FF8C00;
		 color: #FFFFFF;
		 height: 35px;
		 padding-left: 5px;
		 padding-right: 5px;
		 border-radius: 3px;
		 text-align: center;
		 align-items: center;
		 display: flex;
	}
</style>
